<template>
	<view class="order">
		<block v-if="!isLoading">
			<view class="order-list p-tb-25" v-if="!isEmpty">
        <xy-order-item :item="item" v-for="item in orderList" :key="item.id"/>
			</view>
			<view v-else>
				<xy-empty :text="'您暂无'+orderType[orderTypeIndex].name+'订单'" />
			</view>
		</block>
	</view>
</template>

<script>
	import { mapState } from 'vuex';
	import xyEmpty from '@/components/xy-empty';
	import xyOrderItem from '@/components/xy-order/item';
	export default {
		components: {
			xyEmpty,
			xyOrderItem
		},
		data() {
			return {

				isLoading:true,
				isEmpty: true,
				orderList: [],
				currentPage: 1,
				lastPage: 1,
				loadStatus: 'loadmore',
        orderTypeIndex: 0,
				orderType:[
            {name:'课程',type:'course'},
            {name:'商城',type:'goods'},
        ],
        status: ''
			}
		},
		computed: {
			...mapState(['common'])
		},
		async onLoad(options) {
			if(options?.order_type){
        this.orderTypeIndex = options.order_type;
      }
      if(options?.status){
        this.status = options.status;
      }
			this.loadData();
		},
		onPullDownRefresh() {
			this.currentPage = 1;
			this.orderList = [];
			this.loadData();
		},
		onReachBottom() {
			if(this.currentPage < this.lastPage) {
				this.currentPage += 1;
				this.loadData();
			}
		},
		methods: {
			async loadData(){
        this.getOrderList();
			},
			
			getOrderList(){
        var type = this.orderType[this.orderTypeIndex].type;
        var url = '';
        if(type === 'course'){
          url = '/course_order/lists';
        }else if(type === 'goods'){
          url = '/goods_order/lists';
        }
				this.$api.post({
					url: url,
					loadingTip:'加载中...',
					data: {
						page: this.currentPage,
            status : this.status
					},
					success: res => {
            uni.stopPullDownRefresh();
						this.isLoading = false;
						this.orderList = [...this.orderList, ...res.data];
						this.isEmpty = !this.orderList.length;
						this.currentPage = res.current_page; 
						this.lastPage = res.last_page;
						this.loadStatus = this.currentPage < res.last_page ? 'loadmore' : 'nomore';
					}
				});
			},


      change_crumb(index){
        this.orderTypeIndex = index;
        this.currentPage = 1;
        this.orderList = [];
        this.loadData();
      },
			
		}
	}
</script>

<style scoped lang="scss">
.order-list{
  background: #f6f6f6;
}
</style>